<template>
	<view class="content">
		<view class="status_bar"></view>
		<Head :webtext="webtext"></Head>
		<view class="body">
			<view class="formBox">
				<view class="form-bg">
					<u-form ref="uForm" class="formList" label-width="240upx">
						<u-form-item label="钱包类型" label-align="right">
							<u-input v-model="bank_swift" type="select" @click="show = true" />
							<u-action-sheet class="walletTypeList" :list="walletTypeList" v-model="show" @click="actionSheetCallback"></u-action-sheet>
						</u-form-item>
						<u-form-item label="银行名称" label-align="right"><input v-model="bank_name" placeholder="请输入银行名称" /></u-form-item>
						<!-- <u-form-item label="银行地址" label-align="right"><input v-model="bank_address" placeholder="请输入银行地址" /></u-form-item> -->
						<u-form-item label="开户人姓名" label-align="right"><input v-model="user_name" placeholder="请输入开户人姓名" /></u-form-item>
						<u-form-item label="银行卡号" label-align="right"><input type="number" v-model="bank_card" placeholder="请输入银行卡号" /></u-form-item>
						<!-- <u-form-item label="资金密码" label-align="right"><input v-model="bank_account" placeholder="请输入资金密码" /></u-form-item> -->
					</u-form>
				</view>
			</view>
			<view class="button" @click="submit">确定</view>
			<u-toast ref="uToast" :icon="false" />
		</view>
	</view>
</template>

<script>
import Head from '../../components/head.vue';
export default {
	components: {
		Head
	},
	data() {
		return {
			webtext: '赎回',
			bank_name:'',//银行名称
			user_name:'', //开户人姓名
			bank_card:'',//银行卡号
			bank_address:'',//银行地址
			bank_swift:'',//钱包类型
			walletTypeList: [{ text: '银行卡' }],
			show: false
		};
	},
	methods: {
		actionSheetCallback(){
			this.bank_swift = "银行卡"
		},
		submit() {
			if(this.bank_name && this.user_name && this.bank_card && this.bank_swift){
				var d = new Date();
				var datetime = d.getFullYear() + '-' + (d.getMonth() + 1) + '-' + d.getDate() + ' ' + d.getHours() + ':' + d.getMinutes() + ':' + d.getSeconds();
				this.$u.api.add_bank({
					"user_name": this.user_name,
					"bank_card": this.bank_card,
					"bank_name": this.bank_name,
					"bank_swift": this.bank_swift,
					"bank_address": datetime
				}).then(res => {
					uni.showToast({
						title: res.msg,
						duration: 1000,
						icon: 'none'
					});
					setTimeout(()=>{
						uni.navigateTo({
							url:'/pages/mine/bankCardManager'
						})
					},1000)
				})
			} else{
				uni.showToast({
					title: '请填写全部信息',
					duration: 1000,
					icon: 'none'
				});
			}
		}
	}
};
</script>

<style lang="scss" scoped>
.formBox {
	margin-top: 20upx;
	border-top: 2upx solid #55586d;
	.form-bg {
		padding: 10upx 40upx;
		color: #f4f8ff;
		.formList {
			display: flex;
			flex-wrap: wrap;
			font-size: 28upx;
			width: 100%;
			.u-form-item {
				height: 70upx;
				line-height: 70upx;
				width: 100%;
				color: #f4f8ff;
				padding: 10upx 0;
				.u-action-sheet {
					color: #000000;
					width: calc(100% - 220upx);
					border-radius: 6upx;
				}
				.walletTypeList {
					color: #000000;
				}
			}
			.u-border-bottom {
				height: 100%;
			}
		}
	}
}
.button {
	width: calc(100% - 80upx);
	font-size: 34upx;
	margin: 30upx auto;
	height: 80upx;
	line-height: 80upx;
	color: #fff;
	background: #0da3ff;
	padding: 0 40upx;
	text-align: center;
	border-radius: 10upx;
}
.withdrawTip {
	margin: 20upx 0;
	padding: 40upx;
	p {
		line-height: 48upx;
		color: #f4f8ff;
	}
}
/deep/ .u-dropdown__menu__item {
	width: 100%;
	justify-content: flex-start !important;
	.u-flex {
		width: 100%;
		padding: 0 10upx;
		justify-content: space-between;
	}
}
/deep/.uni-input-input {
	color: #fff;
}
</style>
